<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>form表单</title>
</head>
<body>
    <h1>form</h1>
    <form action="#" method="post">
        <!-- 表单分组 -->
        <fieldset>
            <legend>个人信息</legend>
        <p>
            用户名：
            <input type="text"/>
        </p>
        <p>
            真实姓名：
            <input type="text" placeholder="请输入你的真实姓名"/>
        </p>
        <p>
            所在城市：
            <input type="text" value="上海市" disabled/>
        </p>
        <p>
            密码：
            <input type="password" />
        </p>
        <p>
            性别：
            <input type="radio" name="sex" value="1"/>男
            <input type="radio" name="sex" value="2"/>女
            <input type="radio" name="sex" value="0" checked/>保密
        </p>
        <p>
            性别(点文字也能选中，label标签)：
            <label><input type="radio" name="sex" value="1"/>男</label>
            <label><input type="radio" name="sex" value="2"/>女</label>
            <label><input type="radio" name="sex" value="0" checked/>保密</label>
        </p>
        <p>
            爱好：
            <label><input type="checkbox" name="hobby" value="篮球"/>篮球</label>
            <label><input type="checkbox" name="hobby" value="足球"/>足球</label>
            <label><input type="checkbox" name="hobby" value="乒乓球"/>乒乓球</label>
            <label><input type="checkbox" name="hobby" value="编程" checked/>编程</label>
        </p>
        <p>
            省份：
            <select>
                <option value="0">请选择省份</option>
                <option value="湖南省">湖南省</option>
                <option value="浙江省">浙江省</option>
                <option value="江西省">江西省</option>
                <option value="陕西省">陕西省</option>
            </select>
        </p>

        <p>
            国家：
            <select>
                <option value="0" disabled selected>请选择国家</option>
                <optgroup label="亚洲">
                    <option value="CN">中国</option>
                    <option value="JP">日本</option>
                </optgroup>
                <optgroup label="欧洲">
                    <option value="FR">法国</option>
                    <option value="DE">德国</option>
                </optgroup>
            </select>
        </p>
        <p>
            用户评论：
            <textarea cols="60" rows="8"></textarea>
        </p>

        <p>按钮：
            <input type="button" value="普通按钮"/>
            <input type="submit" value="提交按钮"/>
            <input type="reset" value="重置按钮"/>
        </p>
        </fieldset>
    </form>
</body>
</html>